<!DOCTYPE html>
<html xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta http-equiv="Access-Control-Allow-Origin" content="*">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="icon" href="/favicon.ico">
	<link rel="stylesheet" href="/resources/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/resources/css/index.css" media="all" />
</head>
<body>
	<fieldset class="layui-elem-field">
  	<legend>条件选择</legend>
 	 <div class="layui-field-box">
   		<form action="" class="layui-form layui-form-pane">
   			<div class="layui-form-item" align="center">
   			<div class="layui-inline">
   				<label class="layui-form-label">登录名</label>
    			<div class="layui-input-inline">
      				<input type="text" name="loginname"  placeholder="请输入登录名" autocomplete="off" class="layui-input">
    			</div>
   			</div>
   			
   			<div class="layui-inline">
   				<label class="layui-form-label">登录IP</label>
    			<div class="layui-input-inline">
      				<input type="text" name="loginip" placeholder="请输入登录ip" autocomplete="off" class="layui-input">
    			</div>
   			</div>
   			
   			<div class="layui-inline">
   				<label class="layui-form-label">开始时间</label>
    			<div class="layui-input-inline">
      				<input type="text" name="startTime" id="startTime" readonly="readonly" placeholder="yyyy-MM-dd HH-mm-ss"  class="layui-input">
    			</div>
   			</div>
   			
   			<div class="layui-inline">
   				<label class="layui-form-label">结束时间</label>
    			<div class="layui-input-inline">
      				<input type="text" name="endTime" id="endTime" readonly="readonly" placeholder="yyyy-MM-dd HH-mm-ss"  class="layui-input">
    			</div>
   			</div>
   			</div>
   			
   			<div class="layui-form-item" align="center">
   			<div class="layui-inline">
    			<div class="layui-input-inline">
      				 <button class="layui-btn" lay-submit="" lay-filter="search"  id="search">搜索</button>
      				 <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    			</div>
   			</div>	
   			</div>
   			
   		</form>
 	 </div>
</fieldset>
	
	<table id="logininfo" lay-filter="logininfo"></table>
	
	<div>
		<div style="display: none;" id ="toolbar">
			<button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDelete" shiro:hasPermission="info:batchdelete">批量删除</button>
		</div>
		<div style="display: none;" id ="rowBtn">
			<button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete" shiro:hasPermission="info:delete">删除</button>
		</div>
	</div>
	
<script type="text/javascript" src="/resources/layui/layui.js"></script>	
<script type="text/javascript">
	layui.use(["jquery","layer","form","table","laydate"],function(){
		var $ = layui.jquery;
		var layer = layui.layer;	
		var form = layui.form;	
		var table = layui.table;	
		var laydate = layui.laydate;	
		laydate.render({
			elem:"#startTime",
			type:"datetime"
		})
		laydate.render({
			elem:"#endTime",
			type:"datetime"
		})
		var t = table.render({
			elem:"#logininfo",
			page:true,
			url:"/sys/logininfo/list",
			height: 'full-220',
			toolbar:"#toolbar",
			parseData:function(rs){
				if(rs.code != 200){
					layer.msg(rs.msg);
					return false;
				}
				 return {
				      "code": rs.code, //解析接口状态
				      "msg": rs.msg, //解析提示文本
				      "count": rs.data.count, //解析数据长度
				      "data": rs.data.data //解析数据列表
				    };
			},
			response:{
				statusCode: 200
			},
			cols:[ [
				 {type:'checkbox',fixed:"left"},
				 {field: 'id', title: 'ID', sort: true, fixed: 'left',align:"center"},
			     {field: 'loginname', title: '登录名',align:"center"},
			     {field: 'loginip', title: '登录IP',sort: true,align:"center"},
			     {field: 'logintime', title: '登录时间',align:"center"},
			     { title: '操作',toolbar:"#rowBtn",align:"center"}
			] ]
		});
		form.on("submit(search)",function(d){
			t.reload({
				where:d.field,
				page:{
					curr:1
				}
			});
			return false;
		});
		table.on('toolbar(logininfo)', function(obj){
			  var checkStatus = table.checkStatus(obj.config.id);
			  switch(obj.event){
			    case 'batchDelete':
			      layer.msg('添加');
			      batchDelete();
			    break;
			  };
			});
		table.on('tool(logininfo)', function(obj){ 
			var data = obj.data;
			if(obj.event == "delete"){
				deleteOne(data);
			}
		});
		//头监听函数 批量删除开始
		function batchDelete(){
			var checkStatus = table.checkStatus('logininfo');	
			var length = checkStatus.data.length;//获取选中行的数据
			var data = checkStatus.data//获取选中行数量，可作为是否有选中行的条件
			if(length<1){
				layer.msg("至少选择一条数据");
				return false
			}
			layer.confirm('是否删除这些数据?', {icon: 3, title:'提示'}, function(index){
				  //do something
				var ids = '';
				$.each(data,function(index,value){
					if(index==0){
						ids+="ids="+value.id;
					}else{
						ids+="&ids="+value.id;
					}
					console.log(value);
				});
				console.log(ids);
				$.post("/sys/logininfo/batchDelete",ids,function(rs){
					if(rs.code==200){
						t.reload();
					}
						layer.msg(rs.msg);
				});
			 		 layer.close(index);
			});
		};
		//头监听函数 批量删除开始
		
		//行监听函数 删除开始
		function deleteOne(data){
			var id = data.id;
			layer.confirm('是否删除该数据?', {icon: 3, title:'提示'}, function(index){
				$.post("/sys/logininfo/deleteOne",{"id":id},function(rs){
					if(rs.code == 200){
						t.reload();
					}	
					layer.msg(rs.msg);
				});
				layer.close(index);
			});
		};
		//行监听函数 删除结束
	});
</script>

</body>
</html>